<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <link rel="stylesheet" type="text/css" href="/static/plugin/easyUI/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="/static/plugin/easyUI/themes/icon.css">
    <script type="text/javascript" src="/static/plugin/easyUI/jquery.min.js"></script>
    <script type="text/javascript" src="/static/plugin/easyUI/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="/static/plugin/easyUI/locale/easyui-lang-zh_CN.js"></script>
    <script type="text/javascript">
        $(function () {
            $("#menu_dg").datagrid({
                fit:true,
                fitColumns:true,
                url:"/menu/selectRootMenus.do",
                pagination:true,
                columns:[[
                    {field:'id',checkbox: true},
                    {field:'text',title:'菜单名称',width:100},
                    {field:'url',title:'菜单url',width:100}
                ]],
                toolbar:"#menu_dh_tb",
                singleSelect:true,
            })
            /*初始化dialog组件*/
            $("#menu_dig").dialog({
                closed:true,
                width:700,
                height:500,
                buttons:"#menu_dlg_bt",
                onClose:function () {
                    //清空表单的数据
                    $("#menu_form").form("clear");
                    //给已经选择的权限的datagrid加载一个空的数据
                    $("#selectedPermissions").datagrid("loadData", []);
                    //加载所有的权限数据
                    $("#allPermissions").datagrid("load");

                }
            })

            //给所有的A标签 绑定点击事件
            $("a[data-cmd]").click(function () {
                var method = $(this).data("cmd");
                objMethod[method]();
            });
        })

        var objMethod = {
            saveUser:function () {
                //异步提交表单
                $("#menu_form").form('submit',{
                    url:"/menu/saveOrUpdate.do",
                    success:function (data) {
                        data = $.parseJSON(data);
                        if (data.success) {
                            $.messager.alert('温馨提示','保存成功','info',function () {
                                $("#menu_dig").dialog("close");
                                //刷新页面
                                $("#menu_dg").datagrid("reload");
                            });
                        } else {
                            $.messager.alert('温馨提示',data.msg,'error');
                        }
                    }
                })
            },
            addUser:function () {
                //把上次表单的数据清空
                $("#menu_form").form("reset");
                /*设置标题*/
                $("#menu_dig").dialog("setTitle","菜单新增");
                /*打开对话框*/
                $("#menu_dig").dialog("open");
            },
            editUser:function () {
                /*判断是否选择了要编辑的数据*/
                var selectedRow = $("#menu_dg").datagrid("getSelected");
                if (!selectedRow) {
                    $.messager.alert('温馨提示','请选择需要编辑的数据','info');
                    return;
                }
                //修改标题
                $("#menu_dig").dialog("setTitle","菜单编辑");
                //把上次表单的数据清空
                $("#menu_form").form("clear");
                /*把选中的数据显示到form表单*/
                $("#menu_form").form("load", selectedRow);
                //根据菜单的id查询对应的所有的权限信息
                var menuId = selectedRow.id;
                $("#selectedPermissions").datagrid("load", {menuId:menuId}); //重新加载数据
                //打开对话框
                $("#menu_dig").dialog("open");
            },
            reloadUser:function () {
                $("#menu_dg").datagrid("reload");
            },
            cancelUser:function () {
                $("#menu_dig").dialog("close");
            }
        };
    </script>
</head>
<body>
<table id="menu_dg"></table>
<!--表格顶部工具栏-->
<div id="menu_dh_tb">
    <a class="easyui-linkbutton" data-cmd="addUser" data-options="iconCls:'icon-add', text:'新增', plain:true"></a>
    <a class="easyui-linkbutton" data-cmd="editUser" data-options="iconCls:'icon-edit', text:'编辑', plain:true"></a>
    <a class="easyui-linkbutton" data-cmd="reloadUser" data-options="iconCls:'icon-reload', text:'刷新', plain:true"></a>
</div>
<!--对话框底部工具栏-->
<div id="menu_dlg_bt">
    <a class="easyui-linkbutton" data-cmd="saveUser" data-options="iconCls:'icon-save', text:'保存', plain:true"></a>
    <a class="easyui-linkbutton" data-cmd="cancelUser" data-options="iconCls:'icon-cancel', text:'取消', plain:true"></a>
</div>
<!--对话框-->
<div id="menu_dig">
    <form id="menu_form">
        <!--判断是新增还是编辑-->
        <input name="id" type="hidden" id="menu_id">
        <table align="center" style="margin-top: 15px">
            <tr>
                <td>菜单名称:</td>
                <td><input name="text" class="easyui-textbox" style="width:130px"></td>
            </tr>
            <tr>
                <td>菜单url:</td>
                <td><input name="url" class="easyui-textbox" style="width:130px"></td>
            </tr>
        </table>
    </form>
</div>
</body>
</html>
